﻿	<!DOCTYPE html>
<html lang="en">

	<head>
		<meta charset="utf-8">
		<meta http-equiv="X-UA-Compatible" content="IE=edge">
		<meta name="viewport" content="width=device-width, initial-scale=1">
		<title>Jeparo - Responsive Bootstrap 4 Admin Dashboard</title>
		<link rel="shortcut icon" type="image/x-icon" href="Vertical/favicon.ico">
		<!-- google font -->
		<link href="https://fonts.googleapis.com/css?family=Poppins:300,400,500,600,700" rel="stylesheet" type="text/css" />
		<link href="assets/css/bootstrap.min.css" rel="stylesheet" type="text/css">
		<link href="assets/css/font-awesome.min.css" rel="stylesheet" type="text/css">
		<link href="assets/css/ionicons.css" rel="stylesheet" type="text/css">
		<link href="assets/css/simple-line-icons.css" rel="stylesheet" type="text/css">
		<link href="assets/css/jquery.mCustomScrollbar.css" rel="stylesheet">
		<link href="assets/css/weather-icons.min.css" rel="stylesheet">
		<!--Morris Chart -->
		<link rel="stylesheet" href="assets/js/index/morris-chart/morris.css">
		<link href="assets/css/style.css" rel="stylesheet">
		<link href="assets/css/responsive.css" rel="stylesheet">
	</head>

	<body>
		<div class="wrapper">
			<!-- header -->
			<header class="main-header bg_orange">
				<div class="container_header">
					<div class="logo d-flex align-items-center">
						<a href="#"> <strong class="logo_icon"> <img src="assets/images/small-logo.png" alt=""> </strong> 
							<span class="logo-default"> <img src="assets/images/white-logo.png" alt=""> </span> </a>
						<div class="icon_menu full_menu">
							<a href="#" class="menu-toggler sidebar-toggler white_color_toggle"></a>
						</div>
					</div>
					<div class="right_detail">
						<div class="row d-flex align-items-center min-h pos-md-r">
							<div class="col-xl-5 col-3 search_col ">
								<div class="top_function">

									<div class="search">
										<a id="toggle_res_search" data-toggle="collapse" data-target="#search_form" class="res-only-view collapsed" href="javascript:void(0);"
										aria-expanded="false"> <i class=" icon-magnifier"></i> </a>
										<form id="search_form" role="search" class="search-form collapse" action="#">
											<div class="input-group">
												<input type="text" class="form-control" placeholder="Search...">
												<button type="button" class="btn" data-target="#search_form" data-toggle="collapse" aria-label="Close">
													<i class="ion-android-search"></i>
												</button>
											</div>
										</form>
									</div>
								</div>
							</div>
							<div class="col-xl-7 col-9 d-flex justify-content-end">
								<div class="right_bar_top d-flex align-items-center">

									<!-- notification_Start -->
									<div class="dropdown dropdown-notification">
										<a href="javascript:;" class="dropdown-toggle" data-toggle="dropdown" data-hover="dropdown" data-close-others="true" aria-expanded="false"> <i class="fa fa-bell-o"></i> <span class="badge_coun"> 6 </span> </a>
										<ul class="dropdown-menu scroll_auto height_fixed" aria-labelledby="dropdownMenu1">
											<li class="bigger">
												<h3><span class="bold">Notifications</span></h3>
												<span class="notification-label">New 6</span>
											</li>
											<li>
												<ul class="dropdown-menu-list">
													<li>
														<a href="javascript:;"> <span class="time">just now</span> <span class="details"> <span class="notification-icon deepPink-bgcolor"> <i class="fa fa-check"></i> </span> Congratulations!. </span> </a>
													</li>
													<li>
														<a href="javascript:;"> <span class="time">3 mins</span> <span class="details"> <span class="notification-icon purple-bgcolor"> <i class="fa fa-user o"></i> </span> <b>John Micle </b>is now following you. </span> </a>
													</li>
													<li>
														<a href="javascript:;"> <span class="time">7 mins</span> <span class="details"> <span class="notification-icon blue-bgcolor"> <i class="fa fa-comments-o"></i> </span> <b>Sneha Jogi </b>sent you a message. </span> </a>
													</li>
													<li>
														<a href="javascript:;"> <span class="time">12 mins</span> <span class="details"> <span class="notification-icon pink"> <i class="fa fa-heart"></i> </span> <b>Ravi Patel </b>like your photo. </span> </a>
													</li>
													<li>
														<a href="javascript:;"> <span class="time">15 mins</span> <span class="details"> <span class="notification-icon yellow"> <i class="fa fa-warning"></i> </span> Warning! </span> </a>
													</li>
													<li>
														<a href="javascript:;"> <span class="time">10 hrs</span> <span class="details"> <span class="notification-icon red"> <i class="fa fa-times"></i> </span> Application error. </span> </a>
													</li>
												</ul>
											</li>
										</ul>
									</div>
									<!-- notification_End -->
									<!-- DropDown_Inbox -->
									<div class="dropdown dropdown-inbox">
										<a href="javascript:;" class="dropdown-toggle" data-toggle="dropdown" data-hover="dropdown" data-close-others="true"> <i class="fa fa-envelope-o"></i> <span class="badge_coun"> 2 </span> </a>
										<ul class="dropdown-menu scroll_auto height_fixed" aria-labelledby="dropdownMenu1">
											<li class="bigger">
												<h3><span class="bold">Messages</span></h3>
												<span class="notification-label">New 2</span>
											</li>
											<li>
												<ul class="dropdown-menu-list">
													<li>
														<a href="#"> <span class="photo"> <img src="assets/images/about-1.jpg" class="img-circle" alt=""> </span> <span class="subject"> <span class="from"> Sarah Smith </span> <span class="time">Just Now </span> </span> <span class="message"> Jatin I found you on LinkedIn... </span> </a>
													</li>
													<li>
														<a href="#"> <span class="photo"> <img src="assets/images/about-1.jpg" class="img-circle" alt=""> </span> <span class="subject"> <span class="from"> Sarah Smith </span> <span class="time">Just Now </span> </span> <span class="message"> Jatin I found you on LinkedIn... </span> </a>
													</li>
													<li>
														<a href="#"> <span class="photo"> <img src="assets/images/about-1.jpg" class="img-circle" alt=""> </span> <span class="subject"> <span class="from"> Sarah Smith </span> <span class="time">Just Now </span> </span> <span class="message"> Jatin I found you on LinkedIn... </span> </a>
													</li>
													<li>
														<a href="#"> <span class="photo"> <img src="assets/images/about-1.jpg" class="img-circle" alt=""> </span> <span class="subject"> <span class="from"> Sarah Smith </span> <span class="time">Just Now </span> </span> <span class="message"> Jatin I found you on LinkedIn... </span> </a>
													</li>
													<li>
														<a href="#"> <span class="photo"> <img src="assets/images/about-1.jpg" class="img-circle" alt=""> </span> <span class="subject"> <span class="from"> Sarah Smith </span> <span class="time">Just Now </span> </span> <span class="message"> Jatin I found you on LinkedIn... </span> </a>
													</li>
													<li>
														<a href="#"> <span class="photo"> <img src="assets/images/about-1.jpg" class="img-circle" alt=""> </span> <span class="subject"> <span class="from"> Sarah Smith </span> <span class="time">Just Now </span> </span> <span class="message"> Jatin I found you on LinkedIn... </span> </a>
													</li>
												</ul>
											</li>
										</ul>
									</div>
									<!--DropDown_Inbox_End -->
									<!-- Dropdown_User -->
									<div class="dropdown dropdown-user">
										<a href="javascript:;" class="dropdown-toggle" data-toggle="dropdown" data-hover="dropdown" data-close-others="true" aria-expanded="true"> <img class="img-circle pro_pic" src="assets/images/about-1.jpg" alt=""> </a>
										<ul class="dropdown-menu dropdown-menu-default">
											<li>
												<a href="#"> <i class="icon-user"></i> Profile </a>
											</li>
											<li>
												<a href="#"> <i class="icon-settings"></i> Settings </a>
											</li>
											<li>
												<a href="#"> <i class="icon-directions"></i> Help </a>
											</li>
											<li class="divider"></li>
											<li>
												<a href="lock_screen.html"> <i class="icon-lock"></i> Lock </a>
											</li>
											<li>
												<a href="#"> <i class="icon-logout"></i> Log Out </a>
											</li>
										</ul>
									</div>
									<!-- Dropdown_User_End -->
								</div>
							</div>
						</div>
					</div>
				</div>

			</header>
			<!-- header_End -->
			<!-- Content_right -->
			<div class="container_full">

				<div class="side_bar bg_color scroll_auto">
                <div class="user-panel">
						<div class="user_image">
							<img src="assets/images/about-1.jpg" class="img-circle mCS_img_loaded" alt="User Image">
						</div>
						<div class="info">
							<p>
								Alexander Pierce
							</p>
							<a href="#"> <i class="fa fa-circle text-success"></i> Online</a>
						</div>
					</div>
					
					<ul id="dc_accordion" class="sidebar-menu tree">
						<li class="menu_sub">
							<a href="#"> <i class="fa fa-home"></i> <span>Dashboard</span> 
							<span class="arrow"></span> </a>
							<ul class="down_menu">
								<li>
									<a href="index.html">Dashboard 1</a>
								</li>
								<li>
									<a href="index1.html">Dashboard 2</a>
								</li>
								<li>
									<a href="index2.html">E-Commerce</a>
								</li>
								<li>
									<a href="index3.html">Analysis</a>
								</li>
								
								<li>
									<a href="index-green.html">Dashboard Green</a>
								</li>
								<li>
									<a href="index-orange.html">Dashboard Orange</a>
								</li>
								<li>
									<a href="index-purple.html">Dashboard Purple</a>
								</li>
								<li>
									<a href="index-red.html">Dashboard Red</a>
								</li>
								</ul>
						</li>
						<li class="menu_sub">
							<a href="#"> <i class="fa fa-newspaper-o"></i> <span>UI Elements </span> <span class="arrow"></span> </a>
							<ul class="down_menu">
								<li>
									<a href="alert.html">Alerts</a>
								</li>
								<li>
									<a href="buttons.html">Buttons</a>
								</li>
								<li>
									<a href="cards.html">Cards</a>
								</li>
								<li>
									<a href="dropdown.html">Dropdowns</a>
								</li>
								<li>
									<a href="grid.html">Grids</a>
								</li>
								<li>
									<a href="lists.html">Lists</a>
								</li>
								<li>
									<a href="modal.html">Modals</a>
								</li>
								<li>
									<a href="progress.html"> Progress</a>
								</li>
								<li>
									<a href="popover-tooltips.html">Popover &amp; Tooltips</a>
								</li>
								<li>
									<a href="typography.html">Typography</a>
								</li>
								<li>
									<a href="tabs.html">Tabs</a>
								</li>
								<li>
									<a href="tree.html">Tree</a>
								</li>
								<li>
									<a href="toastr.html">Toastr Notification</a>
								</li>
							</ul>
						</li>
						<li class="menu_sub">
							<a href="#"> <i class="fa fa-pie-chart"></i> <span>Portlets</span> <span class="arrow"></span> </a>
							<ul class="down_menu">
								<li>
									<a href="portlet-base.html">Portlets Base</a>
								</li>
								<li>
									<a href="portlet-advanced.html">Portlets Advanced</a>
								</li>
							</ul>
						</li>
						<li class="menu_sub">
							<a href="#"> <i class="fa fa-laptop"></i> <span>Icons</span> <span class="arrow"></span> </a>
							<ul class="down_menu">
								<li>
									<a href="icon-font-awesome.html">Fontawesome Icons</a>
								</li>
								<li>
									<a href="icon-simple-line.html">Simple line Icons</a>
								</li>
							</ul>
						</li>
						<li class="menu_sub">
							<a href="#"> <i class="fa fa-table"></i> <span>Widgets </span> <span class="arrow"></span> </a>
							<ul class="down_menu">
								<li>
									<a href="widgets-base.html">Widgets Base</a>
								</li>
								<li>
									<a href="widgets-chart.html">Widgets Chart</a>
								</li>
							</ul>
						</li>
						<li class="menu_sub">
							<a href="#"> <i class="fa fa-calendar"></i> <span>Calendar </span> <span class="arrow"></span> </a>
							<ul class="down_menu">
								<li>
									<a href="calendar-basic.html">Basic Calendar</a>
								</li>
								<li>
									<a href="calendar-external-events.html">External Events Calendar</a>
								</li>
								<li>
									<a href="calendar-list.html">List Calendar</a>
								</li>
							</ul>
						</li>
						<li class="menu_sub">
							<a href="#"> <i class="fa fa-wpforms"></i> <span>Forms</span> <span class="arrow"></span> </a>
							<ul class="down_menu">
								<li class="menu_sub">
									<a href="#">Form Control <span class="arrow"></span> </a>
									<ul class="down_menu lavel3">
										<li>
											<a href="form-basic-input.html">Basic Input</a>
										</li>
										<li>
											<a href="form-input-group.html">Input Group</a>
										</li>
										<li>
											<a href="form-checkbox-radio.html">Checkbox & Radio</a>
										</li>
									</ul>
								</li>
								<li class="menu_sub">
									<a href="#">Form Validation <span class="arrow"></span> </a>
									<ul class="down_menu lavel3">
										<li>
											<a href="form-validation-basic.html">Basic Validation</a>
										</li>
										<li>
											<a href="form-validation-jquery.html">jQuery Validation</a>
										</li>
										<li>
											<a href="form-wizard.html">Form Wizard</a>
										</li>
									</ul>
								</li>
							</ul>
						</li>
						<li class="menu_sub">
							<a href="#"> <i class="icon-grid"></i> <span>Data Tables</span> <span class="arrow"></span> </a>
							<ul class="down_menu">
								<li>
									<a href="table-basic.html">Basic Table</a>
								</li>
								<li class="menu_sub">
									<a href="#">Data Tables <span class="arrow"></span> </a>
									<ul class="down_menu">
										<li>
											<a href="table-datatable.html">Basic Datatable</a>
										</li>
										<li>
											<a href="table-datatable-show-hide.html">Toggle Col Datatable</a>
										</li>
										<li>
											<a href="table-datatable-ajax.html">Ajax Datatable</a>
										</li>
									</ul>
								</li>
							</ul>
						</li>
						<li class="menu_sub">
							<a href="#"> <i class="fa fa-bar-chart text-aqua"></i> <span>Charts</span> <span class="arrow"></span> </a>
							<ul class="down_menu">
								<li>
									<a href="flot-chart.html">Flot Charts</a>
								</li>
								<li>
									<a href="echart.html">eCharts</a>
								</li>
								<li>
									<a href="morris-chart.html">Morris Charts</a>
								</li>
							</ul>
						</li>
						<li class="menu_sub">
							<a href="#"> <i class="fa fa-file text-aqua"></i> <span>Extra Pages</span> <span class="arrow"></span> </a>
							<ul class="down_menu">
								<li>
									<a href="profile.html">User Profile</a>
								</li>
								<li>
									<a href="page-login.html">Sign In</a>
								</li>
								<li>
									<a href="page-register.html">Sign Up</a>
								</li>
								<li>
									<a href="invoice.html">Invoice</a>
								</li>
								<li>
									<a href="page_404.html">404</a>
								</li>
							</ul>
						</li>
					</ul>
				</div>

				<div class="content_wrapper">
					<div class="container-fluid">
						<!-- breadcrumb -->
						<div class="page-heading">
							<div class="row d-flex align-items-center">
								<div class="col-md-6">
									<div class="page-breadcrumb">
										<h1>Dashboard</h1>
									</div>
								</div>
								<div class="col-md-6 justify-content-md-end d-md-flex">
									<div class="breadcrumb_nav">
										<ol class="breadcrumb">
											<li>
												<i class="fa fa-home"></i>
												<a class="parent-item" href="index.html">Home</a>
												<i class="fa fa-angle-right"></i>
											</li>
											<li class="active">
												Dashboard
											</li>
										</ol>
									</div>
								</div>
							</div>
						</div>
						<!-- breadcrumb_End -->

						<!-- Section -->
						<section class="chart_section">
							<div class="row">
								<div class="col-xl-3 col-sm-6 mb-4">
									<div class="card border-0 text-light">
										<div class="card-body">
											<div class="row">
												<div class="col-12">
													<div class="homepage_single">
														<span class="sec_icon"><i class="fa fa-dollar" aria-hidden="true"></i></span>
														<div class="homepage_fl_right">
															<h4 class="mt-0">Daily sales</h4>
															<h3>$30, <span class="single-count">305</span></h3>
														</div>
														<p>
															Total items sold <span class="fl_right text-success">GOOD <i class="fa fa-long-arrow-up" aria-hidden="true"></i></span>
														</p>
													</div>
												</div>
											</div>
										</div>
									</div>
								</div>

								<div class="col-xl-3 col-md-6 mb-4">
									<div class="card border-0 text-light">
										<div class="card-body">
											<div class="row">
												<div class="col-12">
													<div class="homepage_single">
														<span class="sec_icon"><i class="fa fa-group" aria-hidden="true"></i></span>
														<div class="homepage_fl_right">
															<h4 class="mt-0">Visitors</h4>
															<h3>75, <span class="single-count">843</span></h3>
														</div>
														<p>
															Visitors <span class="fl_right text-danger">Normal <i class="fa fa-long-arrow-down" aria-hidden="true"></i></span>
														</p>
													</div>
												</div>
											</div>
										</div>
									</div>
								</div>

								<div class="col-xl-3 col-sm-6 mb-4">
									<div class="card border-0 text-light">
										<div class="card-body">
											<div class="row">
												<div class="col-12">
													<div class="homepage_single">
														<span class="sec_icon"><i class="fa fa-envelope" aria-hidden="true"></i></span>
														<div class="homepage_fl_right">
															<h4 class="mt-0">Messages</h4>
															<h3><span class="single-count">1228</span></h3>
														</div>
														<p>
															Last month <span class="fl_right text-danger">Normal <i class="fa fa-long-arrow-down" aria-hidden="true"></i></span>
														</p>
													</div>
												</div>
											</div>
										</div>
									</div>
								</div>

								<div class="col-xl-3 col-sm-6 mb-4">
									<div class="card border-0 text-light">
										<div class="card-body">
											<div class="row">
												<div class="col-12">
													<div class="homepage_single">
														<span class="sec_icon"><i class="fa fa-heart" aria-hidden="true"></i></span>
														<div class="homepage_fl_right">
															<h4 class="mt-0">Followers</h4>
															<h3><span class="single-count">+1234K</span></h3>
														</div>
														<p>
															Update now <span class="fl_right text-success">Update <i class="fa fa-refresh" aria-hidden="true"></i></span>
														</p>
													</div>
												</div>
											</div>
										</div>
									</div>
								</div>
							</div>

							<div class="row">

								<div class="col-lg-8 mb-4">
									<div class="card card-shadow">
										<div class="card-header">
											<div class="card-title">
												Top Selling Country
											</div>
										</div>

										<div class="row">
											<div class="col-xl-8 col-lg-7 col-md-8">

												<div class="card-body">
													<div class="vmap-wrap" id="world-map" style="height:200px;"></div>
												</div>
											</div>

											<div class="col-xl-4 col-lg-5 col-md-4">
												<div class="card-body">
													<div class="text_country">
														<h2 class="mt-0"><img src="assets/images/flag1.png" alt="" /> Russia <span>65%</span></h2>
														<div class="progress mb-4" style="height: 5px;">
															<div class="progress-bar bg-primary" role="progressbar" style="width: 65%;" aria-valuenow="65" aria-valuemin="0" aria-valuemax="100"></div>
														</div>
													</div>

													<div class="text_country">

														<h2 class="mt-0"><img src="assets/images/flag2.png" alt="" /> Spain <span>35%</span></h2>
														<div class="progress mb-4" style="height: 5px;">
															<div class="progress-bar bg-warning" role="progressbar" style="width:35%;" aria-valuenow="35" aria-valuemin="0" aria-valuemax="100"></div>
														</div>
													</div>

													<div class="text_country">

														<h2 class="mt-0"><img src="assets/images/flag4.png" alt="" /> Ukraine <span>75%</span></h2>
														<div class="progress mb-4" style="height: 5px;">
															<div class="progress-bar bg-success" role="progressbar" style="width:75%;" aria-valuenow="75" aria-valuemin="0" aria-valuemax="100"></div>
														</div>
													</div>

													<div class="text_country">

														<h2 class="mt-0"><img src="assets/images/flag5.png" alt="" /> Ghana <span>67%</span></h2>
														<div class="progress mb-4" style="height: 5px;">
															<div class="progress-bar bg-info" role="progressbar" style="width:67%;" aria-valuenow="67" aria-valuemin="0" aria-valuemax="100"></div>
														</div>
													</div>
												</div>
											</div>

										</div>

									</div>
								</div>

								<div class="col-lg-4 mb-4">
									<div class="card card-shadow">
										<div class="card-header">
											<div class="card-title">
												New Client
											</div>
										</div>
										<div class="card-body">
											<div class="media mb-4">
												<img class="align-self-center mr-3 rounded-circle" src="assets/images/user1.png" alt=" " style="width: 50px; height: 50px;">
												<div class="media-body">
													<p class="mb-0">
														<strong class="">John Doe</strong>
													</p>
													<span>john_doe@testmail.com</span>
												</div>
											</div>
											<div class="media mb-4">
												<img class="align-self-center mr-3 rounded-circle" src="assets/images/user2.png" alt=" " style="width: 50px; height: 50px;">
												<div class="media-body">
													<p class="mb-0">
														<strong class="">Tnisha Sabrin</strong>
													</p>
													<span>tnisha_s@testmail.com</span>
												</div>
											</div>
											<div class="media mb-4">
												<img class="align-self-center mr-3 rounded-circle" src="assets/images/user3.png" alt=" " style="width: 50px; height: 50px;">
												<div class="media-body">
													<p class="mb-0">
														<strong class="">Tasi Szzd</strong>
													</p>
													<span>tasi_szd@testmail.com</span>
												</div>
											</div>

										</div>
									</div>
								</div>

							</div>

							<div class="row">
								<div class="col-lg-4 mb-4">
									<div class="card card-shadow">
										<div class="card-header">
											<div class="card-title">
												Sales Progress
											</div>
										</div>
										<div class="card-body">
											<div id="line-chart" style="height:300px"></div>
										</div>
									</div>
								</div>

								<div class="col-lg-4 mb-4">

									<div class="list_space card card-shadow">
										<div class="card-header">
											<div class="card-title">
												To Do List
											</div>
										</div>
										<div class="todo--panel">
											<form action="#">
												<div class="scroll_auto hero-height">
													<ul class="list-group ps" data-trigger="scrollbar">
														<li class="list-group-item">
															<label class="todo--label">
																<input type="checkbox" name="checkbox" value="1" class="todo--input" checked="">
																<span class="todo--text">Schedule Meeting</span> </label>
															<a href="#" class="todo--remove">&times;</a>
														</li>
														<li class="list-group-item">
															<label class="todo--label">
																<input type="checkbox" name="checkbox" value="2" class="todo--input">
																<span class="todo--text">Call Clients To Follow-Up</span> </label>
															<a href="#" class="todo--remove">&times;</a>
														</li>
														<li class="list-group-item">
															<label class="todo--label">
																<input type="checkbox" name="checkbox" value="3" class="todo--input" checked="">
																<span class="todo--text">Book Flight For Holiday</span> </label>
															<a href="#" class="todo--remove">&times;</a>
														</li>
														<li class="list-group-item">
															<label class="todo--label">
																<input type="checkbox" name="checkbox" value="4" class="todo--input">
																<span class="todo--text">Forward Important Tasks</span> </label>
															<a href="#" class="todo--remove">&times;</a>
														</li>

													</ul>
												</div>
												<div class="input-group">
													<input type="text" name="todo" placeholder="Add New Task" class="form-control" autocomplete="off" required="">
													<div class="input-group-btn">
														<button type="submit" class="btn-link">
															+
														</button>
													</div>
												</div>
											</form>
										</div>
									</div>

								</div>

								<div class="col-lg-4 mb-4">
									<div class="card card-shadow">
										<div class="card-header">
											<div class="card-title">
												Marketing Campaign
											</div>
										</div>

										<div class="table-responsive">
											<table class="table table-hover m-b-0">
												<tbody>
													<tr>
														<th><i class="fa fa-twitter text-success" aria-hidden="true"></i></th>
														<td>Twitter</td>
														<td><span>972 Records</span></td>
														<td>35% <i class="zmdi zmdi-caret-up"></i></td>
													</tr>
													<tr>
														<th><i class="fa fa-facebook text-success" aria-hidden="true"></i></th>
														<td>Facebook</td>
														<td><span>671 Records</span></td>
														<td>18% <i class="zmdi zmdi-caret-up"></i></td>
													</tr>
													<tr>
														<th><i class="fa fa-linkedin text-success" aria-hidden="true"></i></th>
														<td>linkedin</td>
														<td><span>462 Records</span></td>
														<td>37% <i class="zmdi zmdi-caret-up"></i></td>
													</tr>
													<tr>
														<th><i class="fa fa-instagram text-success" aria-hidden="true"></i></th>
														<td>Instagram</td>
														<td><span>117 Records</span></td>
														<td>19% <i class="zmdi zmdi-caret-up"></i></td>
													</tr>
													<tr>
														<th><i class="fa fa-google-plus text-success" aria-hidden="true"></i></th>
														<td>Google</td>
														<td><span>382 Records</span></td>
														<td>29% <i class="zmdi zmdi-caret-up"></i></td>
													</tr>
													<tr>
														<th><i class="fa fa-mail-forward text-success" aria-hidden="true"></i></th>
														<td>Mailchimp</td>
														<td><span>322 Records</span></td>
														<td>31% <i class="zmdi zmdi-caret-down"></i></td>
													</tr>

													<tr>
														<th><i class="fa fa-lightbulb-o text-success" aria-hidden="true"></i></th>
														<td>Other</td>
														<td><span>267 Records</span></td>
														<td>10% <i class="zmdi zmdi-caret-down"></i></td>
													</tr>
												</tbody>
											</table>
										</div>
									</div>

								</div>

							</div>

							<div class="row">
								<div class="col-lg-6 mb-4">
									<div class="card card-shadow">
										<div class="card-header">
											<div class="card-title">
												Product Sales
											</div>
										</div>
										<div class="card-body">
											<div class="chart_show">
												<canvas id="chartjs_line"></canvas>
											</div>

										</div>
									</div>
								</div>

								<div class="col-lg-6 mb-4">
									<div class="card card-shadow">
										<div class="card-header">
											<div class="card-title">
												Top Sales Countries
											</div>
										</div>
										<div class="card-body">
											<div id="canvas-holder">
												<canvas id="chartjs_pie"></canvas>
											</div>
										</div>
									</div>
								</div>

							</div>

							<div class="row">
								<div class="col-lg-8 mb-4 d-flex align-items-stretch">
									<div class="widthfull card card-shadow">
										<div class="card-header">
											<div class="card-title">
												Recent Sales
											</div>
										</div>
										<div class="card-body">
											<div class="bd-example table_style">

												<table class="table table-responsive-md">
													<thead>
														<tr>
															<th scope="col">Product</th>
															<th scope="col">Customers</th>
															<th scope="col">Categories</th>
															<th scope="col">Popularity</th>
															<th scope="col">Amount</th>

														</tr>
													</thead>
													<tbody>
														<tr>
															<td>iPone X</td>
															<td>
															<ul class="list-unstyled users-list m-0">
																<li data-toggle="tooltip" data-popup="tooltip-custom" data-original-title="Josh Hazlewood" class="pull-up list_membler">
																	<img class="media-object rounded-circle" src="assets/images/img1.jpg" alt="">
																</li>
																<li data-toggle="tooltip" data-popup="tooltip-custom" data-original-title="Beth Mooney" class="pull-up list_membler">
																	<img class="media-object rounded-circle" src="assets/images/img2.jpg" alt="">
																</li>
																<li data-toggle="tooltip" data-popup="tooltip-custom" data-original-title="Megan Schutt" class="pull-up list_membler">
																	<img class="media-object rounded-circle" src="assets/images/img3.jpg" alt="">
																</li>
																<li class="list_membler">
																	<span class="badge badge-info">+10 more</span>
																</li>
															</ul></td>
															<td><a href="#" class="btn btn-sm btn-outline-info round">Mobile</a></td>
															<td>
															<div class="progress" style="height: 5px;">
																<div class="progress-bar bg-info" role="progressbar" style="width:95%;" aria-valuenow="95" aria-valuemin="0" aria-valuemax="100"></div>
															</div></td>
															<td>$1050.00</td>
														</tr>

														<tr>
															<td>iPad</td>
															<td>
															<ul class="list-unstyled users-list m-0">
																<li data-toggle="tooltip" data-popup="tooltip-custom" data-original-title="Josh Hazlewood" class="pull-up list_membler">
																	<img class="media-object rounded-circle" src="assets/images/img1.jpg" alt="">
																</li>
																<li data-toggle="tooltip" data-popup="tooltip-custom" data-original-title="Beth Mooney" class="pull-up list_membler">
																	<img class="media-object rounded-circle" src="assets/images/img2.jpg" alt="">
																</li>

																<li class="list_membler">
																	<span class="badge badge-info">+6 more</span>
																</li>
															</ul></td>
															<td><a href="#" class="btn btn-sm btn-outline-success round">Tablet</a></td>
															<td>
															<div class="progress" style="height: 5px;">
																<div class="progress-bar bg-success" role="progressbar" style="width:65%;" aria-valuenow="65" aria-valuemin="0" aria-valuemax="100"></div>
															</div></td>
															<td>$1140.00</td>
														</tr>

														<tr>
															<td>OnePlus</td>
															<td>
															<ul class="list-unstyled users-list m-0">
																<li data-toggle="tooltip" data-popup="tooltip-custom" data-original-title="Josh Hazlewood" class="pull-up list_membler">
																	<img class="media-object rounded-circle" src="assets/images/img1.jpg" alt="">
																</li>

																<li data-toggle="tooltip" data-popup="tooltip-custom" data-original-title="Beth Mooney" class="pull-up list_membler">
																	<img class="media-object rounded-circle" src="assets/images/img3.jpg" alt="">
																</li>
																<li class="list_membler">
																	<span class="badge badge-info">+8 more</span>
																</li>
															</ul></td>
															<td><a href="#" class="btn btn-sm btn-outline-info round">Mobile</a></td>
															<td>
															<div class="progress" style="height: 5px;">
																<div class="progress-bar bg-info" role="progressbar" style="width:75%;" aria-valuenow="75" aria-valuemin="0" aria-valuemax="100"></div>
															</div></td>
															<td>$1200.00</td>
														</tr>
														<tr>
															<td>ZenPad</td>
															<td>
															<ul class="list-unstyled users-list m-0">
																<li data-toggle="tooltip" data-popup="tooltip-custom" data-original-title="Josh Hazlewood" class="pull-up list_membler">
																	<img class="media-object rounded-circle" src="assets/images/img1.jpg" alt="">
																</li>
																<li data-toggle="tooltip" data-popup="tooltip-custom" data-original-title="Beth Mooney" class="pull-up list_membler">
																	<img class="media-object rounded-circle" src="assets/images/img2.jpg" alt="">
																</li>
																<li data-toggle="tooltip" data-popup="tooltip-custom" data-original-title="Nicole Bolton" class="pull-up list_membler">
																	<img class="media-object rounded-circle" src="assets/images/img3.jpg" alt="">
																</li>
																<li class="list_membler">
																	<span class="badge badge-info">+12 more</span>
																</li>
															</ul></td>
															<td><a href="#" class="btn btn-sm btn-outline-success round">Tablet</a></td>
															<td>
															<div class="progress" style="height: 5px;">
																<div class="progress-bar bg-success" role="progressbar" style="width:45%;" aria-valuenow="45" aria-valuemin="0" aria-valuemax="100"></div>
															</div></td>
															<td>1600.00</td>
														</tr>
													</tbody>
												</table>

											</div>
										</div>
									</div>
								</div>

								<div class="col-lg-4 mb-4 d-flex align-items-stretch">
									<div class="stats-wrap widthfull sale_stets card">
										<div class="card-header">
											<div class="card-title">
												<h3>Timetable</h3>
											</div>

										</div>
										<div class="card_chart">
											<div class="school-timetable">
												<h5><strong>English </strong>with <i> William Shakespear</i></h5>
												<h6><i class="ion-android-home"></i> Room <span>104 B</span></h6>
												<h6><i class="ion-android-time"></i> Mon, October 21st <span>10.00 AM - 12.00 AM</span></h6>
												<ul>
													<li>
														<img class="img-circle round_small" src="assets/images/img1.jpg" alt="">
													</li>
													<li>
														<img class="img-circle round_small" src="assets/images/img2.jpg" alt="">
													</li>
													<li>
														<img class="img-circle round_small" src="assets/images/img3.jpg" alt="">
													</li>
													<li>
														<img class="img-circle round_small" src="assets/images/img4.jpg" alt="">
													</li>
												</ul>
												<hr>
												<h5><strong>Mathematic </strong>with <i> Albert Enstein</i></h5>
												<h6><i class="ion-android-home"></i> Room <span>98 C</span></h6>
												<h6><i class="ion-android-time"></i> Fri, November 1st <span>09.00 AM - 10.00 AM</span></h6>
												<ul>
													<li>
														<img class="img-circle round_small" src="assets/images/img1.jpg" alt="">
													</li>
													<li>
														<img class="img-circle round_small" src="assets/images/img2.jpg" alt="">
													</li>
													<li>
														<img class="img-circle round_small" src="assets/images/img3.jpg" alt="">
													</li>
													<li>
														<img class="img-circle round_small" src="assets/images/img4.jpg" alt="">
													</li>
												</ul>
											</div>
										</div>
									</div>
								</div>

							</div>

						</section>
						<!-- Section_End -->

					</div>
				</div>
			</div>
			<!-- Content_right_End -->
			<!-- Footer -->
			<footer class="footer ptb-20">
				<div class="row">
					<div class="col-md-12 text-center">
						<div class="copy_right">
							<p>
								2018 © Dashboard Theme By
								<a href="http://www.17sucai.com/">Jeparo</a>
							</p>
						</div>
						<a id="back-to-top" href="#"> <i class="ion-android-arrow-up"></i> </a>
					</div>
				</div>
			</footer>
			<!-- Footer_End -->
		</div>
		<script type="text/javascript" src="assets/js/jquery.min.js"></script>
		<script type="text/javascript" src="assets/js/popper.min.js"></script>
		<script type="text/javascript" src="assets/js/bootstrap.min.js"></script>
		<script type="text/javascript" src="assets/js/jquery.mCustomScrollbar.concat.min.js"></script>
		<!--vectormap-->
		<script src="assets/js/index/jquery-jvectormap-1.2.2.min.js"></script>
		<script src="assets/js/index/jquery-jvectormap-world-mill-en.js"></script>
		<script src="assets/js/index/vmap-init.js"></script>
		<!--Morris Chart-->
		<script src="assets/js/index/morris-chart/morris.js"></script>
		<script src="assets/js/index/morris-chart/raphael-min.js"></script>
		<!--morris chart initialization-->
		<script src="assets/js/index/morris-chart/morris-init.js"></script>
		<!-- chart js -->
		<script src="assets/js/index/Chart.bundle.js"></script>
		<script src="assets/js/index/utils.js"></script>

		<script src="assets/js/index/chart.js"></script>

		<script type="text/javascript" src="assets/js/jquery.dcjqaccordion.2.7.js"></script>
		<script src="assets/js/custom.js" type="text/javascript"></script>

	</body>

</html>
